<style>
    .show{display: inherit}
    .hide{display: none}
    table tr td,table tr th{width: 5%}
    .layui-btn{margin-right: 10px}

    .layui-table-cell {overflow-x: hidden;overflow: inherit; }/*
    .layui-table-box {
        overflow: inherit;
    }
    .layui-table-body {
        overflow: inherit;
    }*/
    .layui-table-cell{padding:2px 4px;line-height:20px;}

    th span,.layui-table-cell{white-space:normal;}

</style>
<div class="fixed-bar" style="clear:both;">
    <form class="layui-form layui-form-pane fixed-bar-form" action="{:url('',['status' => $status])}" method="get" id="hisi-table-search">
        <div class="layui-form-item" style="margin-bottom:0px;">
            <div class="layui-inline show">
               <label class="layui-form-label">订单号</label>
                <div class="layui-input-inline">
                    <input type="text" name="client_ordernum" lay-verify="" placeholder="输入订单号" class="layui-input">
                </div>
            </div>
            <div class="layui-inline show">
                <label class="layui-form-label">sku</label>
                <div class="layui-input-inline">
                    <input type="text" name="sku" lay-verify="" placeholder="输入sku" class="layui-input">
                </div>
            </div>
            <div class="layui-inline show">
                <label class="layui-form-label ">下单日期</label>
                <div class="layui-input-inline">
                    <input type="text" name="create_date_range" readonly="" id="create_date_range" lay-verify="" placeholder="选择创建日期" class="layui-input">
                </div>
            </div>
            <div class="layui-inline show">
                <label class="layui-form-label ">完成日期</label>
                <div class="layui-input-inline">
                    <input type="text" name="over_date_range" readonly="" id="over_date_range" lay-verify="" placeholder="选择创建日期" class="layui-input">
                </div>
            </div>
            <div class="layui-inline">
                <label class="layui-form-label">来源帐号</label>
                <div class="layui-input-inline">
                    {:Form::select('is_auto_import', '', [''=> '请选择']+config('mimo.order_from'), '', '')}
                </div>
            </div>
            <div class="layui-inline show">
                <label class="layui-form-label">委外类型</label>
                <div class="layui-input-inline">
                    {:Form::select('group_out_type', '', $group_out_type_select, '', '')}
                </div>
            </div>

            <div class="layui-inline show">
                <label class="layui-form-label ">提交时间</label>
                <div class="layui-input-inline">
                    <input type="text" name="submit_date_range" readonly="" id="submit_date_range" lay-verify="" placeholder="选择创建日期" class="layui-input">
                </div>
            </div>
            <div class="layui-inline show">
                <label class="layui-form-label">结算状态</label>
                <div class="layui-input-inline">
                    {:Form::select('status_account', '', $status_account_select, '', '')}
                </div>
            </div>
            <div class="layui-inline show">
                <label class="layui-form-label">委外工厂</label>
                <div class="layui-input-inline xm-select-demo" id="demo2" style="width: auto;min-width: 250px;">
                </div>
            </div>
            <div class="layui-inline">
                <button type="submit" id="seacher" class="layui-btn" lay-submit="" lay-filter="demo1">搜索</button>
                <button type="button" class="layui-btn layui-btn-primary hisi-export show">导出</button>
            </div>
        </div>
    </form>
</div>
<div class="layui-tab layui-tab-brief" lay-filter="docDemoTabBrief" style="clear:both;">
  <ul class="layui-tab-title" id="vue_tab_content">
    <li class="layui-this"><a onclick="statCli(1)" href="#">对账审核（<span class="red bold stat-num-1">{{ statData_1 }}</span>条/<span class="red bold stat-num-1">驳回{{ statData_2 }}条</span>）</a></li>
    <li><a onclick="statCli(2)" href="#">已审核（<span class="red bold stat-num-2">{{ statData_3 }}</span>条）</a></li>
    <li><a onclick="statCli(3)" href="#">复核账单（<span class="red bold stat-num-3">{{ statData_4 }}</span>条）</a></li>
    <li><a onclick="statCli(4)" href="#">已提交（<span class="red bold stat-num-3">{{ statData_5 }}</span>条）</a></li>
  </ul>
    <div class="layui-tab-content">
        <table id="dataTable" lay-filter="demoEvent"></table>
    </div>
</div>      



{include file="system@block/layui" /}

<script type="text/html" id="picTpl">
    <span class="lay-pic-container" src="{{ d.pic }}">
		<img src="{{ d.ori_pic }}" class="lay-pic">
	</span>
</script>
<script type="text/html" id="skuTpl">
    <span >{{ d.is_auto_import_name }}</span> <br>
    <span class="copy-item">{{ d.client_ordernum }}</span> <br>
    <span class="copy-item">{{ d.sku }}</span></br>
    <span >{{ d.ft_name }}/{{ d.ft_group_name }}</span>
</script>
<script type="text/html" id="materialTpl">
    {{# if(d.is_share== 1){ }}
        <a class="layui-btn layui-btn-normal layui-btn-xs layui-bg-orange">共</a>
    {{# } }}
    <span class="copy-item">{{ d.mInfo.name }}</span><br />
	{{d.mInfo.color}}
</script>
<script type="text/html" id="unit">
{{d.mInfo.unit}}
</script>
<script type="text/html" id="color">
{{d.mInfo.color}}
</script>
<script type="text/html" title="操作按钮模板" id="buttonTpl">
    <a href="{:url('billList')}?stall_feed_id={{d.id}}&status_type=1&status_real=0" class="hisi-iframe blue bill-list-a" hisi-data="{width: '70%', height: '70%'}" title="费用单">帐单明细</a></br>
<!--    <a href="{:url('stallCost/stallCostDetail')}?stall_feed_id={{d.id}}" title="费用单" class="hisi-iframe blue" hisi-data="{width: '70%', height: '90%'}">查看费用单</a>-->
</script>
<script type="text/html" id="toolbar">
    <div class="layui-btn-group fr">
		<a data-href="{:url('check')}?status=1120" class=" layui-btn layui-btn-primary layui-btn-sm j-page-btns confirm layui-icon check">审核</a>&nbsp;&nbsp;
        
        <a data-href="{:url('check')}?status=1101" class=" layui-btn layui-btn-primary layui-btn-sm j-page-btns confirm layui-icon back">返审</a>&nbsp;&nbsp;
        
        <a data-href="{:url('makeBill')}" class=" layui-btn layui-btn-primary layui-btn-sm j-page-btns confirm layui-icon make-bill">生成账单</a>

        <a data-href="{:url('submitPayment')}" class=" layui-btn layui-btn-primary layui-btn-sm j-page-btns confirm layui-icon submit-payment">提交结算</a>
    </div>
</script>
<script type="text/html" id="detailTpl">
    <a href="{:url('StallBillFeed/stallBillFeedDetail')}?stall_bill_id={{d.id}}" title="明细表" class="hisi-iframe blue" hisi-data="{width: '100%', height: '100%'}">打开</a>
<!--    <form class="layui-form layui-form-pane fixed-bar-form" action="{:url('StallBillFeed/stallBillFeedDetail')}?stall_bill_id={{d.id}}" method="get" id="hisi-table-search">-->
        <a href="{:url('StallBillFeed/stallBillFeedDetail')}?stall_bill_id={{d.id}}&export=1" style="cursor:pointer;border: none" class="blue hisi-export">下载</a>
<!--    <form>-->
</script>
<script src="__PUBLIC_JS__/jquery.2.1.4.min.js?v={:config('hisiphp.version')}"></script>
<script src="__PUBLIC_JS__/xm-select/dist/xm-select.js?v={:config('hisiphp.version')}"></script>
<script src="__PUBLIC_JS__/vue@3.2.26/dist/vue.global.js"></script>
<script type="text/javascript">
    //#vue_tab_content
    const allContent = {
        data() {
            return {
                statData_1:{:arrayGet($statData, 1, 0)},
            statData_2:{:arrayGet($statData, 2, 0)},
            statData_3:{:arrayGet($statData, 3, 0)},
            statData_4:{:arrayGet($statData, 4, 0)},
            statData_5:{:arrayGet($statData, 5, 0)}
        }
        }
    }
     const vm=Vue.createApp(allContent).mount('#vue_tab_content');
    layui.use(['table', 'laydate', 'form', 'laytpl','tool','layer'], function() {
        var $ = layui.jquery;
        var table = layui.table;
        var laydate = layui.laydate;
        var form = layui.form;
        var layer = layui.layer;
		var initialize=0,second_initialize=0,first_init=0,changetab=0;
        laydate.render({
		    elem: '#create_date_range'
		    ,range: '~'
		    ,theme: 'molv'
		    ,mark: {'{:$today}':''}
	    	,change: function(value, date, endDate){
		    	$('#create_date_range').val(value);
            	$('#layui-laydate1').remove();//关闭面板
            }
		});
        laydate.render({
            elem: '#over_date_range'
            ,range: '~'
            ,theme: 'molv'
            ,mark: {'{:$today}':''}
            ,change: function(value, date, endDate){
                $('#over_date_range').val(value);
                $('#layui-laydate1').remove();//关闭面板
            }
        });
        laydate.render({
		    elem: '#submit_date_range'
		    ,range: '~'
		    ,theme: 'molv'
		    ,mark: {'{:$today}':''}
	    	,change: function(value, date, endDate){
		    	$('#submit_date_range').val(value);
            	$('#layui-laydate2').remove();//关闭面板
            }
		});

		window.status=0;
        window.statCli = function(status) {
			var url='{:url()}?status='+status;
			window.status=status;
            $("#hisi-table-search").attr('action',url);
            $("#seacher").click();  
			changetab=1;  
		}
		
        table.render({
            elem: '#dataTable'
            ,url: '{:url("", ["status" => $status])}' //数据接口
            ,page: true //开启分页
            //,skin: 'row'
            ,even: true
            ,limit: 5
            ,limits: [5,10,20,50,100,150,200]
            ,text: {
                none : '暂无相关数据'
            }
            ,openVisible: false
            ,toolbar: '#toolbar'
            
            ,defaultToolbar: ['exports', 'print']
            ,cols: [[ //表头
                {type:'checkbox'}
                ,{field:'pic',title : '图片', templet:'#picTpl',width:110}
                //2--18
                ,{field: 'col2', title: '来源/订单号/sku/委外工厂', templet: '#skuTpl' ,width:200}
                ,{field: 'sum_shicai_count', title: '裁床数' ,width:60}
                ,{field: 'group_out_type_txt', title: '委外类型' ,width:80}
                ,{field: 'cost_jiagong_littleSumCost', title: 'MES车缝价' ,width:80}
                ,{field: 'cost_jiagong_scale', title: 'MES倍率' ,width:80}
                ,{field: 'mes_cost_res', title: 'MES加工费' ,width:80}
                ,{field: 'dress_changkuan_unitPrice', title: 'MES长款补贴单价' ,width:80}
                // ,{field: 'order_price', title: 'MES加工费',edit:'text',style:'border-bottom:2px dotted #5FB878;'}
                // ,{field: 'cost_little', title: '小计',edit:'text',style:'border-bottom:2px dotted #5FB878;'}

                ,{field: 'unit_num', title: '委外倍率' ,width:80}
                ,{field: 'u_price_manual', title: '手工/专机单价' ,width:80}
                ,{field: 'u_scale_changkuan', title: '长款补贴倍率' ,width:80}
                ,{field: 'order_price_res', title: '委外单价' ,width:80}
                ,{field: 'order_price_res_changkuan', title: '长款补贴单价' ,width:80}
                ,{field: 'caichuang_t_strip_price', title: '捆条金额',width:80,edit:'text',style:'border-bottom:2px dotted #5FB878;'}
                ,{field: 'sum_jiaohuo_count', title: '车间总数',width:80}
                ,{field: 'sum_jiaohuo_tail_count', title: '尾部总数',width:80}

                ,{field: 'sum_store_count', title: 'MES入仓总数',width:100}
                ,{field: 'sum_stock_in', title: '米莫入库数',width:80}
                ,{field: 'real_pay_count', title: '实际结算总数',width:80}

                ,{field: 'chayi_num', title: '差异数',width:60}
                ,{field: 'price_all', title: '加工费总金额' ,width:100}
                ,{field: 'confiscation_num', title: '没收',edit:'text',style:'border-bottom:2px dotted #5FB878;'}
                ,{field: 'after_return_time', title: '工时'}

                ,{field: 'after_return_price', title: '返工金额',width:80,edit:'text',style:'border-bottom:2px dotted #5FB878;'}
                ,{field: 'other_cut_payment', title: '其它扣款',width:80,edit:'text',style:'border-bottom:2px dotted #5FB878;'}
                ,{field: 'remark', title: '备注'}
                ,{field: 'admin_username', title: '上一操作人'}
                //19-23
                ,{field: 'ogp_create_time', title: '生成时间',width:150}
                ,{field: 'ft_group_name', title: '委外工厂',width:150}
                ,{field: 'order_count', title: '总订单（个）',width:120}
                ,{field: 'sum_price_all', title: '总金额（元）',width:120}
                ,{field: 'sum_caichuang_t_strip_price', title: '捆条扣款（元）',width:150}
                ,{field: 'sum_after_return_price', title: '返工计时扣款（元）',width:200}
                ,{field: 'sum_other_cut_payment', title: '其它扣款（元）',width:150}
                ,{field: 'payable', title: '应付金额（元）',width:150}

                ,{field: 'time_submit', title: '提交时间',width:150}
                ,{field: 'status_account', title: '结算状态',width:100}
                ,{field: 'username', title: '提交人',width:100}

                ,{field: 'col3', title: '操作',templet:'#buttonTpl',width:100}
           ]]
            ,done: function(res, curr, count){
                 var data=res.data;
                var status=res.status;
                for (var i in data){
                    $('#stall-ids-'+data[i]['id']).val(data[i]['stall_id']);
                }
                layui.form.render();
                //设置 对账审核（2条/驳回0条）已审核（2条）复核账单（1条）已提交（0条）
                vm.$data.statData_1=res.statData[1];
                vm.$data.statData_2=res.statData[2];
                vm.$data.statData_3=res.statData[3];
                vm.$data.statData_4=res.statData[4];
                vm.$data.statData_5=res.statData[5];
                if(status==1){
                    $('table tr').each(function(i){
                        var remove_field=['ft_group_name','order_count','sum_after_return_price'
                            ,'sum_other_cut_payment','col3'
                            ,'time_submit','status_account'
                            ,'username','payable'
                            ,'sum_price_all','sum_caichuang_t_strip_price','ogp_create_time'
                        ];
                        for(var i in remove_field) {
                            var temp=$(this).find('[data-field="'+remove_field[i]+'"]').remove();
                        }
                    });
                    $('.check').show();
                    $('.back').remove();
                    $('.make-bill').remove();
                    $('.submit-payment').remove();
                    $('.hisi-export').show();//导出 按钮
                }else if(status==2){
                    $('table tr').each(function(i){
                        var remove_field=['ft_group_name','order_count','sum_after_return_price'
                            ,'sum_other_cut_payment','col3'
                            ,'time_submit','status_account'
                            ,'username','payable'
                            ,'sum_price_all','sum_caichuang_t_strip_price','ogp_create_time'
                        ];
                        for(var i in remove_field) {
                            var temp=$(this).find('[data-field="'+remove_field[i]+'"]').remove();
                        }
                        $(this).find('[data-edit="text"]').removeAttr('style').removeAttr('data-edit');
                    });
                    $('.check').remove();
                    $('.back').show();
                    $('.make-bill').show();
                    $('.submit-payment').remove();
                    $('.hisi-export').show();//导出 按钮
                }
                else if(status==3){
                    $('table tr').each(function(i){
                        var remove_field=['col2','sum_shicai_count','group_out_type_txt','order_price'
                        ,'group_unit_price','order_price_res','caichuang_t_strip_price','sum_che_return_goods_num','sum_wei_return_goods_num'
                        ,'sum_jiaohuo_count','sum_jiaohuo_tail_count','pic'
                            ,'sum_store_count','chayi_num','price_all','confiscation_num','after_return_time'
                            ,'after_return_price','other_cut_payment','remark','admin_username'
                            ,'time_submit','status_account'
                            ,'username'
                            ,'cost_little'
                            ,'cost_jiagong_littleSumCost','cost_jiagong_scale','mes_cost_res','dress_changkuan_unitPrice'
                            ,'unit_num','u_price_manual','u_scale_changkuan','order_price_res_changkuan'
                            ,'sum_stock_in','real_pay_count'
                        ];
                        for(var i in remove_field) {
                            var temp=$(this).find('[data-field="'+remove_field[i]+'"]').remove();
                        }
                    });
                    $('.check').remove();
                    $('.back').remove();
                    $('.make-bill').remove();
                    $('.submit-payment').show();
                    $('.hisi-export').hide();//导出 按钮
                    $('.bill-list-a').attr('href',$('.bill-list-a').attr('href')+'&status_real=1130') ;
                }
                else if(status==4){
                    $('table tr').each(function(i){
                        var remove_field=['col2','sum_shicai_count','group_out_type_txt','order_price'
                            ,'group_unit_price','order_price_res','caichuang_t_strip_price','sum_che_return_goods_num','sum_wei_return_goods_num'
                            ,'sum_jiaohuo_count','sum_jiaohuo_tail_count','pic'
                            ,'sum_store_count','chayi_num','price_all','confiscation_num','after_return_time'
                            ,'after_return_price','other_cut_payment','remark','admin_username'
                            ,'ogp_create_time'
                            ,'cost_little'
                            ,'cost_jiagong_littleSumCost','cost_jiagong_scale','mes_cost_res','dress_changkuan_unitPrice'
                            ,'unit_num','u_price_manual','u_scale_changkuan','order_price_res_changkuan'
                            ,'sum_stock_in','real_pay_count'
                        ];
                        for(var i in remove_field) {
                            var temp=$(this).find('[data-field="'+remove_field[i]+'"]').remove();
                        }
                    });
                    $('.check').remove();
                    $('.back').remove();
                    $('.make-bill').remove();
                    $('.submit-payment').hide();
                    $('.hisi-export').hide();//导出 按钮
                }
                //搜索填写控制
                search_btn(status);
                table.on('edit(demoEvent)', function(obj){
                    var value = obj.value //得到修改后的值
                        ,d = obj.data //得到所在行所有键值
                        ,field = obj.field; //得到字段
                    var id=d.id;

                    $.ajax({
                        type: "POST",
                        url: "{:url('editUnit')}",
                        data: "id="+d.id+"&field="+field+"&value="+value,
                        dataType:"json",
                        success: function(res){
                            if (res.code == 1) {
                                layer.msg(res.msg, {icon: 1});
                            } else {
                                layer.msg(res.msg, {icon: 2,anim: 6});
                            }
                        }
                    });
                });
            }
        });
    });

    var factory_ids_json = {:json_encode($factory_ids)};

    var demo2 = xmSelect.render({
        el: '#demo2',
        name:'factory_ids',
        autoRow: true,
        filterable: true,
        tree: {
            show: true,
            showFolderIcon: true,
            showLine: true,
            indent: 20,
            expandedKeys: [ -1 ],
            lazy: true,
            load: function(item, cb){
                console.log(item);
                console.log(cb);
            }
        },
        toolbar: {
            show: true,
            list: ['ALL', 'REVERSE', 'CLEAR']
        },
        height: 'auto',
        data(){
            return factory_ids_json
        }
    })

    //搜索填写控制
    function search_btn(status) {
        switch (status) {
            case 1:
            case 2:
                var hide_field=['submit_date_range','status_account'
                ];
                for(var i in hide_field) {
                    $('.layui-form-item').find('[name="'+hide_field[i]+'"]').parent().parent().hide();
                }
                var show_field=['client_ordernum','sku','is_auto_import','group_out_type','over_date_range','create_date_range'
                ];
                for(var i in show_field) {
                    $('.layui-form-item').find('[name="'+show_field[i]+'"]').parent().parent().show();
                }
                break;
            case 3:
                var hide_field=['client_ordernum','sku','is_auto_import','group_out_type','create_date_range'
                    ,'over_date_range','submit_date_range','status_account'
                ];
                for(var i in hide_field) {
                    $('.layui-form-item').find('[name="'+hide_field[i]+'"]').parent().parent().hide();
                }
                var show_field=[
                ];
                for(var i in show_field) {
                    $('.layui-form-item').find('[name="'+show_field[i]+'"]').parent().parent().show();
                }
                break;
            case 4:
                var hide_field=['client_ordernum','sku','is_auto_import','group_out_type','create_date_range'
                    ,'over_date_range','submit_date_range','status_account'
                ];
                for(var i in hide_field) {
                    $('.layui-form-item').find('[name="'+hide_field[i]+'"]').parent().parent().hide();
                }
                var show_field=['submit_date_range','status_account'
                ];
                for(var i in show_field) {
                    $('.layui-form-item').find('[name="'+show_field[i]+'"]').parent().parent().show();
                }
                break;
        }

    }
</script>